const path = require("path");
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const webpack = require('webpack')
const htmlWebpackPlugin=require('html-webpack-plugin')
module.exports = {
    entry: "./src/main.js", //入口
    output: {
        //出口
        path: path.resolve(__dirname, "dist"), //获取我们当前的绝对路径
        filename: "bundle.js",
        publicPath: "dist/",
    
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: ["style-loader", "css-loader"],
            },
            {
                test: /\.(png|jpg|gif)$/,
                use: [
                    {
                        loader: "url-loader",
                        options: {
                            limit: 8192,
                            name: "img/[name].[hash:8].[ext]",
                        },
                    },
                ],
            },
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                use: {
                    loader: "babel-loader",
                    options: {
                        presets: ["es2015"],
                    },
                },
            },
            {
                test: /\.vue$/,
                use:['vue-loader'],
            },
        ],
    },
    resolve:{
        alias:{
            'vue$':'vue/dist/vue.esm.js'
        }
    },
    plugins: [
        // make sure to include the plugin for the magic
        new VueLoaderPlugin(),
        new webpack.BannerPlugin('webpacktest！'),
        new htmlWebpackPlugin({
            template: 'index.html' // template根据什么模板来生成
        }),
    ],
    devServer:{
        contentBase:'./dist',
        inline:true,
    }
};
